
<div class="body_main_container pos_relative">
	<div class="body_middle_container body_mar_b">
		<div class="body_top_height_start">
			<div class="row">
				<div class="span383 acount_setting">
					<h3>Account settings</h3>
					<p>
						<div class="acount_pos">
						<label for="email">Profile Name:</label>
						<input type="text" name="display_name" id="display_name" value="<?echo $this->userDetails->display_name;?>" onClick="acountChange()">
						<div class="acount_pos_abs"><p>Change</p><p><img onClick="profileEmpty();" src="<?php echo $basePath; ?>/images/social_media/edit_ico.png"/></p></div>
						</div>
					</p>
					<p id="passwordLable">
						<label for="email">Password:</label>
						<input type="password" name="password" id="password" placeholder="reset your password" onfocus="showConfirmPassword()" >
					</p>
					<p id="confirmLable" style="display: none;">
						<label for="email">Confirm Password:</label>
						<input type="password" name="confirmPwd" id="confirmPwd" placeholder="confirm password">
					</p>
					<?php
						if( $this->userDetails->email != "" )
						{
					?>
							<p>
								<label for="email">Email id:</label>
								<input type="text" name="email" id="email" readonly value="<?echo $this->userDetails->email;?>" readonly >
							</p>
					<?php
						}
					?>
					<div class="email_verified">
						<div>
							<img src="<?php echo $basePath; ?>/images/social_media/email_verify.png"/>
							<p>EmailID<br/>VERIFIED</p>
						</div>
						<!--<div>
							<a href="javascript:void(0);" onclick="changeAccountStatus(3,<?echo $this->userDetails->user_id;?>);">Delete Account</a>
						</div>-->
						<div id="active-deactive-id" class="deac_btn_t">
							<a href="javascript:void(0);" onclick="changeAccountStatus(2,<?echo $this->userDetails->user_id;?>);">Deactivate Account</a>
						</div>
					</div>
					<div class="clearfix"></div>
					<p style="margin:10px 0 10px;"><a class="pri_pub_btn" href="javascript:void(0);" onclick="updateUser(<?echo $this->userDetails->user_id;?>)">Save</a><span id="deactiveLoad" style="display:none"><img src="<?php echo $basePath; ?>/images/social_media/loading.gif"></span></p>
					<p id="updateMessage" style="color:green"></p>
				</div>
				<div class="span590">
					<h3>User Summery</h3>
					<div class="account_div_mar_tb"><p><b><?echo $this->getPublicDataboxCount;?></b> Public Databoxes  <b><?echo $this->getPrivateDataboxCount;?></b> Private Databoxes created <b>(<?echo (10-($this->getPublicDataboxCount+$this->getPrivateDataboxCount));?> available)</b>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="<?php echo $basePath; ?>/images/social_media/create_a.png"/> <b><a href="<?php echo $baseUrl; ?>/databox/category-choice">Create</a></b></p>
					</div>
					<div class="montage_tracked account_div_mar_tb">
					<p>
					<img src="<?php echo $basePath; ?>/images/social_media/star1.png"/>&nbsp;Montage tacked&nbsp;
					<?if($_SESSION['usersinfo']->montage_paragraph!=""){?>
					<img src="<?php echo $basePath; ?>/images/social_media/ok.png"/>
					<?}else{?>
					<b>x</b>
					<?}?>
					</p>
					</div>
					<div class="total_key account_div_mar_tb">
					<?php
					?>
							<p><b>Total keywords <?php echo $this->totalKeywords; ?></b> <span>(public databoxes)</span></p>
					</div>
					<div class="responsive_for_post account_div_mar_tb" style="position:relative;">
						<?php
							$upTotal = 0;
							$downTotal = 0;
							if( $this->votesCountRow->countUp != null )
							{
								$upTotal = $this->votesCountRow->countUp;
							}
							if( $this->votesCountRow->countDown != null )
							{
								$downTotal = $this->votesCountRow->countDown;
							}
						?>
						<div class="responsive_pos_ab_l"><p><span><b class="done_font"><?php echo $upTotal; ?></b><br/><b class="font_size">Votes</b></span>&nbsp;</span></p></div>
						<p><img src="<?php echo $basePath; ?>/images/social_media/done.png"/></p>
						<p><span>Response for posts</span></p>
						<p><img src="<?php echo $basePath; ?>/images/social_media/notdone.png"/></p>
						<div class="responsive_pos_ab_r"><p><span>
						<span><b class="done_font"><?php echo $downTotal; ?></b><br/><b class="font_size">Votes</b></span></span>
						</p></div>
					</div>
					<div class="links_colleced">
						<p><b><?echo $this->getTotalLinks;?></b> Links collected, categorized, #hashtagged</p>
					</div>
					<div class="account_profile_title">
						<p><b>UPLOAD PICTURE</b> &nbsp;(for montage, thumb, montage box home display ) <span>Upload  minimum 300 X 300</span></p>
					</div>
					<div class="upload_picture">
						<div class="montage_pick">
							<div class="file-input-wrapper">
							<h5>&nbsp;#mycollections</h5>
								<?
									$montage_image="";
									if(strpos($_SESSION['usersinfo']->montage_image, "https://") !== false || strpos($_SESSION['usersinfo']->montage_image, "http://") !== false) 
								   { 
										   $montage_image=$_SESSION['usersinfo']->montage_image;
								   }else{
										$montage_image=$basePath.'/images/project/montageImages/'.$_SESSION['usersinfo']->montage_image;
								   }
								
								?>
								<img id="uploadedAccountImage1" src="<?php echo $montage_image; ?>" class="btn-file-input" />
							</div>
						</div>
						<p><a href="javascript:void(0);" onclick="adjustImageCrop()">ADJUST</a></p>
					</div>
					<div class="upload_picture">
						<div class="thumb_pick">
							<div class="file-input-wrapper-2 imagePreview" id="mediumImage">
								<img id="uploadedAccountImage2" src="<?php echo $montage_image; ?>" class="btn-file-input" />
							</div>
						</div>
						<!--<p>Adjust</p>-->
					</div>
					<div class="upload_picture">
						<div class="montage_box_pick">
							<div class="file-input-wrapper-3 imagePreview" id="samllImage">
								<img id="uploadedAccountImage3" src="<?php echo $montage_image; ?>" class="btn-file-input" />
							</div>
						</div>
						<!--<p>Adjust</p>-->
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
</div>
<form id="accountForm" name="accountForm" method="post" enctype="multipart/form-data">
<input type="file" name="accountPublicImageFile" id="accountPublicImageFile" style="display:none;" >
</form>
<div class="clearfix"></div>

<input type="hidden" id="cropImage" name="cropImage" value="0" />

<script>

$(function() {
	$('#pop-up-image-crop-new').cropit({
		imageBackground: true
	});
	$('.export').click(function() {
		var src = $('#pop-up-image-crop-new').cropit('export');
		var fetchUploadedUrl = BASE_URL+'/upload-montage-image';
		var imageId=$('#cropImage').val();
		$("#l_i_c").show();
		$.ajax({
			type	: "POST",
			url		: fetchUploadedUrl,
			data	: { data: src,page:'acc',imageId:imageId},
			success: function(data){
				$("#l_i_c").hide();
				$('#pop-up-image-crop-new').popUpWindow({action: "close"});
				$('#uploadedAccountImage1').attr('src',src);
				$('#uploadedAccountImage2').attr('src',src);
				$('#uploadedAccountImage3').attr('src',src);
				$('#headerImage1').attr('src',src);
				$('#cropImage').val(data.imageId);
			}
		});
		//window.open(imageData);
	});
});

</script>



<script>

$('#uploadedAccountImage1').click(function(event){
	$('#pop-up-image-crop-new').popUpWindow({action: "open"});
	//crop_value_countt=0;
	//$('#accountPublicImageFile').click();
});
function adjustImageCrop(){
	$('#pop-up-image-crop-new').popUpWindow({action: "open"});
	//crop_value_countt=0;
	//$('#accountPublicImageFile').click();
}
$("#accountPublicImageFile").change(function(click) {
	var crop_width=0;
	var crop_height=0;
    var file, img;
    if ((file = this.files[0])) {
        img = new Image();
		img.src = _URL.createObjectURL(file);
        img.onload = function() {
			crop_width=this.width;
			crop_height=this.height;
			accountPicChange1(img.src,crop_width,crop_height);
        };
    }
});
$(document).ready(function(){
  $("#display_name").click(function(){
    $(".acount_pos_abs").show();
  });
});
function acountChange(){
	  $(".acount_pos_abs").hide();
}
function showConfirmPassword(){
	  $("#confirmLable").show();
}
function profileEmpty(){
	  $("#display_name").val('');
	  $("#display_name").focus();
	  $(".acount_pos_abs").hide();
}
</script>
